<template>
  <p>我是来自上一级的上一级传过来的数据</p>
  <p>我不是来自props里的数据</p>
  <p>我叫：{{user}}，来自父级的父级中的provide里定义的user，我的爱好有：{{length}}种</p>
  <br>
  <p>我是以setup的方式来传递数据的</p>
  <p>我的中文名是：{{name}}，我的年龄是：{{info.age}}，我的性别是：{{info.sex}},我的爱好是：{{info.my}}</p>
  <el-button @click="edit">修改</el-button>
</template>

<script>
  import {inject} from 'vue'
  export default {
    name: "sub-todo",
    inject: ['user', 'length'],
    setup() {
      const name = inject('name')
      const info = inject('info')
      const addThing = inject('addThing')

      function edit() {
        name.value = '阿西吧'
        addThing('222')
      }

      return {
        name,
        info,
        addThing,
        edit
      }
    }
  }
</script>

<style scoped>

</style>
